import React from 'react'
import store from '../../redux/store'
import {jiaAction, jianAction, asyncJiaAction} from '../../redux/reducers/countReducer';
import { decreAction, increAction } from '../../redux/reducers/zanReducer';

export default function ReduxCom() {
  //新增回调
  const add = () => {
    store.dispatch(jiaAction(1));
  }
  
  //减少回调
  const minus = () => {
    store.dispatch(jianAction(1));
  }

  //异步的更新状态
  const asyndAdd = () => {
    store.dispatch(asyncJiaAction(10));
  }

  const incre = () => {
    store.dispatch(increAction(5));
  }
  
  const decre = () => {
    store.dispatch(decreAction(1024));
  }

  return (
    <div>
      <h2>当前 redux 中的状态值为: {store.getState().count}</h2>
      <button onClick={add}>新增</button>
      <button onClick={minus}>减少</button>
      <button onClick={asyndAdd}>1秒后增加10</button>

      <h2>当前的点赞数 {store.getState().zan}</h2>
      <button onClick={incre}>点赞 +1</button>
      <button onClick={decre}>点赞 -1</button>
    </div>
  )
}
